<template>
    <div style="width: 100%">
        <el-tree-select v-if="!isInstanceSearch" :style="selectStyle" :disabled="isDisable"
                        v-model="properties.bindValue" :data="treeList" :placeholder="properties.selectPlaceHolder"
                        :clearable="properties.isClearable" :filterable="properties.isFilterable"
                        :multiple="properties.isMultiple" :props="defaultProps"
                        :collapse-tags="properties.isMultiple && properties.isCollapseTags"
                        :collapse-tags-tooltip="properties.isMultiple && properties.isCollapseTags && properties.isCollapseTagsTooltip"
                        :max-collapse-tags="properties.isMultiple && properties.isCollapseTags ? properties.maxCollapseTags : ''"
                        :render-after-expand="false"
        />

        <el-tree-select v-if="isInstanceSearch" :style="selectStyle" :disabled="isDisable"
                        v-model="properties.searchValue" :data="treeList" :placeholder="properties.selectPlaceHolder"
                        :clearable="properties.isClearable" :filterable="properties.isFilterable"
                        :multiple="false" :props="defaultProps"
                        :collapse-tags="properties.isMultiple && properties.isCollapseTags"
                        :collapse-tags-tooltip="properties.isMultiple && properties.isCollapseTags && properties.isCollapseTagsTooltip"
                        :max-collapse-tags="properties.isMultiple && properties.isCollapseTags ? properties.maxCollapseTags : ''"
                        :render-after-expand="false"
        />
    </div>
</template>

<script setup lang="ts" name="YwuFormTreeSelect">
import {computed, defineProps, ref} from 'vue'
import {doFromInfoValue} from "@/views/bpmn/form/formUtils.ts";

let props = defineProps(['isEdit', 'properties', 'isInstanceSearch', "isDisable", "formBuildList"]);

let isEdit = computed(() => {return props['isEdit']})
let properties = computed(() => {return props['properties']})
let isInstanceSearch = computed(() => {return props['isInstanceSearch']})
let isDisable = computed(() => {return props['isDisable']})
let formBuildList = computed(() => {return props['formBuildList']})

let selectStyle = computed(() => {
    if (isEdit.value) {
        return "pointer-events: none;"
    } else {
        return "";
    }
})

let defaultProps = computed(() => {
    return {
        children: properties.value.optionChildren,
        label: properties.value.optionLabel,
        value: properties.value.optionValue
    }
})

let treeList = ref([])

function execFunc(resList) {
    treeList.value = resList
}

init()
function init() {
    doFromInfoValue(properties.value, formBuildList.value, execFunc)
}

const value = ref()
</script>

<style scoped lang="less">

</style>